import React, { useState, Suspense, useEffect } from 'react';
import { useRoutes } from 'react-router-dom'
import routes from './routes'
import { } from 'antd';
import './global.css'

import { jumpTo } from '../src/utils/jump'
import { useNavigate } from 'react-router-dom'
import PageLoading from './component/pageLoading'

function App() {

  const element = useRoutes(routes);

  //导航
  const navigate = useNavigate()


  //[]空数组相当于componentDidMount
  useEffect(() => {
    const intervalId = setInterval(function () {
      //checkDeviceType();
    }, 1000 * 3);
    //返回的函数相当于unmountComponentAtNode
    return () => {
      clearInterval(intervalId);
    }
  }, []);

  function checkDeviceType() {
    const deviceType = detectDeviceType()
    if (deviceType != "Desktop") {
      jumpTo(navigate, '/error', true, null)
    }
  }

  function detectDeviceType() {
    const userAgent = navigator.userAgent || navigator.vendor || window.opera;
    // 检测是否为移动设备
    if (/android/i.test(userAgent)) {
      return 'Android Device';
    }
    if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
      return 'iOS Device';
    }
    // 检测是否为 Windows Phone 设备
    if (/windows phone/i.test(userAgent)) {
      return 'Windows Phone Device';
    }
    // 检查是否包含 "Mobile" 关键词，用于其他非 iOS/Android 移动设备
    if (/mobile/i.test(userAgent)) {
      return 'Mobile Device';
    }
    // 如果以上条件都不满足，我们假设是桌面设备
    return 'Desktop';
  }



  return (
    <Suspense fallback={<PageLoading />}>
      {element}
    </Suspense>
  );
}



export default App;
